<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8" import="hiring.tong.com.talent.entity.*"%>

<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %> 
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>    
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
 <link rel="stylesheet" href="<%=request.getContextPath()%>/static/common/plugin/nice-validator/demo/demo.css">
</head>
<body>
<c:if test="${!empty mession }">
<Strong>${mession }</Strong>
</c:if>

<form class="form" data-validator-option="{timely:2, focusCleanup:true}" action="<%=request.getContextPath()%>/TalentServlet?command=update" method="post" target="_parent">

    <div class="form-item">
        <label class="label">Username</label>
        <input type="text" name="username" 
            data-rule="required;username;"
            data-rule-username="[/[\w\d]{4,30}/, 'Please enter 3-12 digits, letters, underscores']"
            data-tip="You can use letters, numbers and periods"
            placeholder="${talent.name }"
        >
    </div>
    <div class="form-item">
        <label class="label">Password</label>
        <input type="password" name="pwd"
            data-rule="Password: required; length(8~16)"
            data-tip="Please fill in at least eight characters"
             placeholder="${talent.password }"
        >
    </div>
    <div class="form-item">
        <label class="label">Verify Password</label>
        <input type="password" name="pwdAgain" data-rule="Verify Password: required; match(pwd)"  placeholder="${talent.password }">
    </div>
    <div class="form-item">
        <label class="label">Gender</label>
        <select name="gender" data-rule="required" id="sex">
            <option value="">select ...</option>
            <option value="1">Male</option>
            <option value="2">Female</option> 
        </select>
  
    </div>
      <div class="form-item">
        <label class="label">Age</label>
        <select name="age" data-rule="required;age">
        <option value="">-请选择-</option>
          	<script>
           	var age = '${talent.age}';
           	for (var i = 10; i <= 80; i++) {
           		if (age == i) {
           			document.write('<option value="' + i + '" selected="selected">' + i + '</option>');
           		} else {
           			document.write('<option value="' + i + '">' + i + '</option>');
           		}
           	}
					</script>
            
        </select>
    </div>
    <div class="form-item">
        <label class="label">Email</label>
        <input type="text" name="email" data-rule="required;email"  placeholder="${talent.email }">
    </div>
    <div class="form-item">
        <label class="label">Phone</label>
        <input type="text" name="phone" data-rule="required;phone"  placeholder="${talent.phone }">
    </div>
	<div class="form-item">
        <label class="label">Interest</label>
        <label><input type="checkbox" name="interest" value="sports">sports</label>
		<label><input type="checkbox" name="interest" value="movie">movie</label>
		<label><input type="checkbox" name="interest" value="game">game</label>
		<label><input type="checkbox" name="interest" value="Java">Java</label>
		<label><input type="checkbox" name="interest" value="PHP">PHP</label>
		
    </div>
	

	<div class="form-item">
        <label><input type="checkbox" id="agree_arguments" data-rule="checked">I agree to the service agreement.</label>
    </div>

    <div class="form-item">
        <button type="submit">Submit</button>
    </div>
     
</form>




<script src="http://dn-nice.qbox.me/libs/jquery/1.x/jquery.min.js"></script>
<script src="<%=request.getContextPath()%>/static/common/plugin/nice-validator/jquery.validator.js?local=en"></script>
 <script>
 var  sex='${talent.gender}';
 var sexs=document.getElementById("sex").options;
 for(var i=0;i<sexs.length;i++){
 	if(sexs[i].value==sex){
 		
 		sexs[i].selected = true;	
 		break;
 	}
 }
	
			  var hobby ='${talent.hobby}';
			  
				var hobbies = hobby.split('|');
				var hobbyItems = document.getElementsByName('interest');
				
				for (var i = 0; i < hobbies.length; i++) {
					for (var j = 0; j < hobbyItems.length; j++) {
						if (hobbies[i] == hobbyItems[j].value) {
							hobbyItems[j].checked = true;
							break;
						}
					}
				}
			
</script>
</body>
</html>